<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>画布教程</title>
	</head>
	<body>
		<canvas id="myCanvas" width="300" height="100" style="border:1px solid #c3c3c3;">
			
		</canvas>
		<script>
			var c = document.getElementById("myCanvas");
			var ctx = c.getContext("2d"); //获取该canvas的2D绘图环境对象
			ctx.fillStyle="red";//填充颜色
			ctx.fillRect(0,10,80,80);//填充坐标位置
			ctx.strokeStyle="blue";
			ctx.strokeRect(90,10,80,80);
		</script>
	</body>
</html>